<template>
  <div>
    <div class="box">
      <div>
        <el-button type="primary" @click="back">返回首页</el-button>
        <div class="aaaa">
          <div class="bbbb">
            <img src="../assets/images/avatar.jpg" alt="" />
            <input type="text" placeholder="输入框" />
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  created() {
    this.$message.warning("个人信息页开发中，请期待！");
  },
  methods: {
    back() {
      this.$router.go(-1);
    },
  },
};
</script>

<style lang="less" scoped>
.box {
  width: 100%;
  height: 100vh;
  background: url(~@/assets/images/bgaa.png) no-repeat;
  background-size: cover;
  background-position: center center;
}
.aaaa {
  display: flex;
  width: 100%;
  height: 70px;
  align-items: center;
  // background-color: #ccc;
  .bbbb {
    height: 70px;
    line-height: 70px;

    width: 100%;
    display: flex;
    background: linear-gradient(
      rgba(12, 129, 123, 0.2),
      rgba(255, 129, 151, 0.3)
    );

    img {
      margin: auto 0 auto 20px;
      width: 40px;
      height: 40px;
    }
    input {
      width: 100%;
      height: 70px;
      border: none;
      background-color: transparent;
      &:focus {
        outline: none;
      }
    }
  }
}
</style>
